import { h } from 'snabbdom/build/package/h'
import { init } from 'snabbdom/build/package/init'
import { classModule } from 'snabbdom/build/package/modules/class'

// init函数返回的patch是一个函数，里面的modules参数可以指定挂载哪些额外模块
// patch函数负责更新虚拟dom到真实dom中，并返回虚拟dom引用
let patch = init([])

// h函数负责创建虚拟dom
let vnode = h('div#container', [
    h('h1', 'Hello Snabbdom'),
    h('p', '这是一个P标签')
])

let app = document.querySelector('#app')

let oldVnode = patch(app, vnode);

setTimeout(() => {
  vnode = h('div#container', [
    h('h1', 'Hello World'),
    h('p', 'Hello P')
  ])
  patch(oldVnode, vnode)

  // 清空页面元素，不能使用patch(oldVnode, null)，而是通过创建注释节点
  // patch(oldVnode, h('!'))
}, 2000)
